<!--suppress ALL -->
<template>
    <!--<a id="modal-929310" href="#modal-container-equipment" role="button" class="btn" data-toggle="modal">Launch demo modal</a>-->
    <div class="modal fade" id="modal-container-update-equipment" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button id="closeLicenseCreate" type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">更新设备</h4>
                </div>
                <div class="modal-body">
                    <el-form :model="form" :rules="rules" ref="form" label-width="125px" v-loading="loading">
                        <input id="equipment_update_id" v-model="form.id" type="hidden"></input>
                        <el-form-item label="名称" prop="name">
                            <el-input id="equipment_update_name" v-model="form.name"></el-input>
                        </el-form-item>
                        <el-form-item label="类别" prop="category_id">
                            <el-select v-model="form.category_id" placeholder="请选择类别">
                                <el-option v-for="(category,index) in categories" :key="index"
                                           :value="index" :label="category"></el-option>
                            </el-select>
                            <input id="equipment_update_category_id" v-model="form.category_id" type="hidden"/>
                        </el-form-item>
                        <el-form-item label="状态" prop="status">
                            <el-select v-model="form.status" placeholder="请选择状态">
                                <el-option v-for="(status,index) in statuses" :key="index"
                                           :value="index" :label="status"></el-option>
                            </el-select>
                            <input id="equipment_update_status" v-model="form.status" type="hidden"/>
                        </el-form-item>
                        <el-form-item label="编号" prop="original_number">
                            <el-input id="equipment_update_original_number" v-model="form.original_number"></el-input>
                        </el-form-item>
                        <el-form-item label="新编号" prop="new_number">
                            <el-input id="equipment_update_new_number" v-model="form.new_number"></el-input>
                        </el-form-item>
                        <el-form-item label="厂家编号" prop="factory_number">
                            <el-input id="equipment_update_factory_number" v-model="form.factory_number"></el-input>
                        </el-form-item>
                        <el-form-item label="规格" prop="model_number">
                            <el-input id="equipment_update_model_number" v-model="form.model_number"></el-input>
                        </el-form-item>
                        <el-form-item label="量程" prop="scale">
                            <el-input id="equipment_update_scale" v-model="form.scale"></el-input>
                        </el-form-item>
                        <el-form-item label="所需证数量" prop="need_lic_count">
                            <el-input-number v-model="form.need_lic_count" :min="1" :max="10"
                                             label="描述文字"></el-input-number>
                            <input id="equipment_update_need_lic_count" v-model="form.need_lic_count" type="hidden"/>
                        </el-form-item>
                        <el-form-item label="生产厂家" prop="producer_id">
                            <model-select :options="producers" v-model="form.producer_id" placeholder="请选择生产厂家"></model-select>
                            <input id="equipment_update_producer_id" v-model="form.producer_id" type="hidden"/>
                        </el-form-item>
                        <el-form-item label="使用部门" prop="department_id">
                            <model-select :options="departments" v-model="form.department_id" placeholder="请选择使用部门"></model-select>
                            <input id="equipment_update_department_id" v-model="form.department_id" type="hidden"/>
                        </el-form-item>
                        <el-form-item label="设备位置">
                            <model-select :options="locations" v-model="form.location_id" placeholder="请选择设备位置"></model-select>
                            <input id="equipment_update_location_id" v-model="form.location_id" type="hidden" @input="parseInput"/>
                        </el-form-item>
                        <el-form-item label="备注" prop="remark">
                            <el-input id="equipment_update_remark" v-model="form.remark"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="submitForm('form')">保存</el-button>
                            <el-button data-dismiss="modal">取消</el-button>
                        </el-form-item>
                    </el-form>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        props: ['categories', 'producers', 'departments', 'locations','statuses'],
        data() {
            return {
                form: {
                    id: '',
                    name: '',
                    category_id: '',
                    producer_id: '',
                    department_id: '',
                    location_id: '',
                    original_number: '',
                    factory_number: '',
                    new_number: '',
                    model_number: '',
                    scale: '',
                    need_lic_count: 1,
                    status: 1,
                    remark: '',
                },
                loading: false,
                address_number: '',
                address: '',
                rules: {
                    category_id: [
                        {required: true, message: '请选择设备类别', trigger: 'change'}
                    ],
                    name: [
                        {required: true, message: '请输入设备名称', trigger: 'blur'},
                        {min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur'}
                    ],
                    original_number: [
                        {required: true, message: '请输入设备编号', trigger: 'blur'},
                        {min: 2, max: 40, message: '长度在 2 到 40 个字符', trigger: 'blur'}
                    ]
                }
            };
        },

        methods: {
            submitForm: function (formName) {
                console.log(this.form.status);
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.loading = true;
                        axios.put('equipment/' + this.form.id, this.form)
                            .then(resp => {
                                if (resp.error) {
                                    this.$notify.error({
                                        title: '保存设备信息失败',
                                        message: resp.message
                                    });

                                } else {
                                    this.$notify({
                                        title: '保存设备信息成功',
                                        message: resp.data.message,
                                        type: 'success'
                                    });
                                    this.form.location_id = resp.data.data.id;
                                }
                            })
                            .catch(error => {
                                this.$notify.error({
                                    title: '发生异常,保存设备信息失败',
                                    message: error
                                });
                            });
                        this.loading = false;
                    } else {
                        this.$notify.error({
                            title: '保存失败',
                            message: '表单数据验证不通过'
                        });
                        return false;
                    }
                });
            },
            parseInput () {
                this.form.department_id = parseInt(this.form.department_id);
                this.form.location_id = parseInt(this.form.location_id);
                this.form.producer_id = parseInt(this.form.producer_id);
            }
        }
    }
</script>
